import React, { Component } from 'react';
import { connect } from 'react-redux'
import { messages, deepFullCopy } from "share/common";
import { Form, Button } from 'antd'
import Condition from 'components/condition'
import 'styles/request-and-expense-settings/slide-frame-content.scss'

const FormItem = Form.Item;
const { If } = Condition;

class SlideFrameDefaultInfo extends Component {

  render() {
    const { data } = this.props.params;
    const formItemLayout = {
      labelCol: { span: 6 },
      wrapperCol: { span: 17, offset: 1 },
    };
    return (
      <div className="slide-frame-content">
        <Form className="new-form">
          {data.map((item, index) => (
            <div key={index}>
              <If value={item.title}>
                <div className="sub-title" style={item.titleStyle || {}}>{item.title}</div>
              </If>
              <FormItem
                {...(item.formItemLayout || formItemLayout)}
                label={item.label || ' '}
                extra={item.extra}
              >
                {item.value}
              </FormItem>
              <div className="slide-footer">
                <Button onClick={this.props.close}>{messages('common.cancel')/*取消*/}</Button>
              </div>
            </div>
          ))}
        </Form>
      </div>
    )
  }
}

function mapStateToProps(state) {
  return {}
}

const WrappedSlideFrameDefaultInfo = Form.create()(SlideFrameDefaultInfo);

export default connect(mapStateToProps)(WrappedSlideFrameDefaultInfo);
